<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="icon" href="https://blz.nosdn.127.net/1/overwatch/images/common/overwatch.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/shop.css">
    <link rel="stylesheet" href="./fonts/zmy_font/iconfont.css">

</head>

<body>
    <!-- 1、顶部导航栏模块 begin -->
    <div class="top">
        <nav class="desktop">
            <div class="desktop_left">
                <!-- logo模块 -->
                <a href="#" class="desktop_logo"></a>
                <!-- 左侧菜单栏模块 -->
                <div class="desktop_items">
                    <ul>
                        <li>
                            <a href="#" class="active">游戏<i class="iconfont"></i></a>
                        </li>
                        <li><a href="#">商城</a></li>
                        <li><a href="#">新闻</a></li>
                        <li><a href="#">电子竞技<i class="dropdown"></i></a></li>
                        <li><a href="#">积分福利</a></li>
                    </ul>
                </div>
            </div>
            <!-- 右侧菜单栏模块 -->
            <div class="desktop_profileItems">
                <ul>
                    <li><a href="#"><span></span> 未成年人家长监护</a></li>
                    <li><a href="#">支持</a></li>
                    <li><a href="#">我的账户<i class="dropdown"></i></a></li>
                </ul>
            </div>
        </nav>
    </div>
    <!-- 1、顶部导航栏模块 end -->

    <!-- 2、固定定位导航栏模块 begin -->
    <nav class="menu">
        <div class="menu_left">
            <a href="#" class="menu_logo"></a>
            <a href="#" class="menu_pic">
                <i class="iconfont icon-fenlei-shouwangxianfeng"></i>
            </a>
            <ul class="menu_downList">
                <li data-menu="0">
                    游戏<i class="iconfont icon-xiangxiajiantou"></i>
                    <!-- 隐藏的悬浮下拉列表 -->
                    <div class="dropdown_menu">
                        <div class="dropdown_menu_arrow"></div>
                        <div class="dropdown_menu_content">
                            <a href="./index.html">概述</a>
                        </div>
                    </div>
                </li>
                <li onclick="window.location.href='./heroes.html'">英雄</li>
                <li onclick="window.location.href='./crx.html'">第1赛季</li>
                <li data-menu="1">
                    新闻<i class="iconfont icon-xiangxiajiantou"></i>
                    <!-- 隐藏的悬浮下拉列表 -->
                    <div class="dropdown_menu">
                        <!-- 隐藏的悬浮下拉列表的三角形 -->
                        <div class="dropdown_menu_arrow"></div>
                        <!-- 隐藏的悬浮下拉列表的内容 -->
                        <div class="dropdown_menu_content">
                            <a href="./ymx.html">新闻</a>
                            <a href="./zll.html">补丁</a>
                        </div>
                    </div>
                </li>
                <li onclick="window.location.href='./media.html'">视频图片</li>
                <li data-menu="2">
                    社区<i class="iconfont icon-xiangxiajiantou"></i>
                    <!-- 隐藏的悬浮下拉列表 -->
                    <div class="dropdown_menu">
                        <!-- 隐藏的悬浮下拉列表的三角形 -->
                        <div class="dropdown_menu_arrow"></div>
                        <!-- 隐藏的悬浮下拉列表的内容 -->
                        <div class="dropdown_menu_content">
                            <a href="./zs.html">论坛<i class="iconfont icon-youshangjiantou"></i></a>
                            <dl>
                                <dt>电子竞技</dt>
                                <dd>守望先锋挑战者选拔赛<i class="iconfont icon-youshangjiantou"></i></dd>
                                <dd>守望先锋挑战者系列赛<i class="iconfont icon-youshangjiantou"></i></dd>
                                <dd>守望先锋联赛<i class="iconfont icon-youshangjiantou"></i></dd>
                            </dl>
                        </div>
                    </div>
                </li>
                <li data-menu="3">
                    商城<i class="iconfont icon-xiangxiajiantou"></i>
                    <!-- 隐藏的悬浮下拉列表 -->
                    <div class="dropdown_menu">
                        <!-- 隐藏的悬浮下拉列表的三角形 -->
                        <div class="dropdown_menu_arrow"></div>
                        <!-- 隐藏的悬浮下拉列表的内容 -->
                        <div class="dropdown_menu_content">
                            <a href="#">商城<i class="iconfont icon-youshangjiantou"></i></a>
                            <dl>
                                <dt></dt>
                                <dd onclick="window.location.href='./jzx.html'">
                                    《守望先锋联赛》
                                    <p>个性化物品</p>
                                </dd>
                            </dl>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="menu_download">
            <a href="#">下载游戏</a>
        </div>
    </nav>
    <!-- 2、固定定位导航栏模块 end -->
    <div class="introduce">
        <div class="info">
            <h1>《守望先锋联赛》个性化物品</h1>
            <p>在《守望先锋》“归来”中，使用充满特色的传奇皮肤和专门为《守望先锋联赛》粉丝设计的个性化物品，为你带来全新的游戏体验。</p>
            <p>赶紧前往游戏内的《守望先锋联赛》商城购买吧！</p>
        </div>
        <div class="logo">
            <img src="./images/logo.svg" alt="" title="Overwatch">
        </div>
    </div>
    <div class="goods">
        <div class="title">
            <h1>第1赛季</h1>
            <p>庆祝《守望先锋联赛》创立五周年，现推出锦标赛传奇皮肤和赛事限定队伍皮肤，还有2022赛季礼包等你来抢购！</p>
        </div>
        <div class="content">
            <div class="left">
                <div class="pic">
                    <img src="./uplods/goods1.png" alt="" title="第5赛季捆绑包">
                    <div class="box">
                        <p>礼包</p>
                    </div>
                </div>
                <h1>2022赛季礼包</h1>
                <p>《守望先锋联赛》2022赛季传奇皮肤礼包，包含皇家骑士、夏日法披、计时之道和蒙面摔角。</p>
                <span><img src="./images/pic.svg" alt="">750</span>
            </div>

            <div class="right">
                <ul>
                    <li>
                        <div class="pic">
                            <img src="./uplods/goods2.png" alt="" title="计时之道">
                            <div class="box">
                                <p>皮肤</p>
                            </div>
                        </div>
                        <h1>计时之道</h1>
                        <p>"倒计时杯"资格附加赛传奇皮肤</p>
                        <span>
                            <img src="./images/pic.svg" alt="">
                            300
                        </span>

                    </li>
                    <li>
                        <div class="pic">
                            <img src="./uplods/goods3.png" alt="" title="夏日法披">
                            <div class="box">
                                <p>皮肤</p>
                            </div>
                        </div>
                        <h1>夏日法披</h1>
                        <p>"夏季挑战赛"锦标赛传奇皮肤</p>
                        <span>
                            <img src="./images/pic.svg" alt="">
                            300
                        </span>
                    </li>
                    <li>
                        <div class="pic">
                            <img src="./uplods/goods4.png" alt="" title="皇家骑士">
                            <div class="box">
                                <p>皮肤</p>
                            </div>
                        </div>
                        <h1>皇家骑士</h1>
                        <p>"季中争霸赛"全球锦标赛传奇皮肤</p>
                        <span>
                            <img src="./images/pic.svg" alt="">
                            300
                        </span>
                    </li>
                    <li>
                        <div class="pic">
                            <img src="./uplods/goods5.png" alt="" title="蒙面摔角">
                            <div class="box">
                                <p>皮肤</p>
                            </div>
                        </div>
                        <h1>蒙面摔角</h1>
                        <p>"开战锦标赛"锦标赛传奇皮肤</p>
                        <span>
                            <img src="./images/pic.svg" alt="">
                            300
                        </span>
                    </li>
                    <li>
                        <div class="pic">
                            <img src="./uplods/goods6.png" alt="" title="雄狮蒙面摔角">
                            <div class="box">
                                <p>皮肤</p>
                            </div>
                        </div>
                        <h1>雄狮蒙面摔角</h1>
                        <p>洛杉矶角斗士队"开战锦标赛"队伍皮肤</p>
                        <span>
                            <img src="./images/pic.svg" alt="">
                            200
                        </span>
                    </li>
                    <li>
                        <div class="pic">
                            <img src="./uplods/goods7.png" alt="" title="猛虎蒙面摔角">
                            <div class="box">
                                <p>皮肤</p>
                            </div>
                        </div>
                        <h1>猛虎蒙面摔角</h1>
                        <p>首尔王朝队"开战锦标赛"队伍皮肤</p>
                        <span>
                            <img src="./images/pic.svg" alt="">
                            200
                        </span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="purchase">
        <div class="box">
            <div class="head">
                <img src="./images/pic1.png" alt="">
            </div>
            <div class="buy">
                <h2>购买《守望先锋》联赛代币</h2>
                <p>前往战网商店购买《守望先锋》联赛代币，在游戏内选购你最喜欢的皮肤和个性化物品吧!</p>
                <div class="button">
                    <a href="https://shop.battlenet.com.cn/zh-cn/product/overwatch-league-tokens"
                        target="_blank">购买代币</a>
                </div>
            </div>
            <div class="foot">
                <img src="./images/buy.png" alt="">
            </div>
        </div>
    </div>
    <div class="way">
        <h1>获取联赛代币</h1>
        <p>锁定《守望先锋联赛》官方直播间，绑定战网账户并观看一定小时数的《守望先锋联赛》直播内容，即可获得联赛代币。没错，就是这么简单！</p>
    </div>
    <div class="other">
        <div class="banner">
            <a href="https://weibo.com/overwatchleague"><img src="./uplods/banner1.png" alt="">
                <img src="./uplods/banner2.png" alt=""></a>
        </div>
        <a href="https://weibo.com/overwatchleague">
            <img src="./uplods/banner.png" alt="">
        </a>
    </div>
    <div class="footer2">
        <h1>关注《守望先锋联赛》</h1>
        <ul>
            <li>
                <div class="box">
                    <a href="https://weibo.com/overwatchleague">
                        <img src="./uplods/banner2.png" alt="">
                    </a>
                </div>
            </li>
            <li>
                <div class="box">
                    <a href="https://weibo.com/overwatchleague">
                        <img src="./uplods/banner2.png" alt="">
                    </a>
                </div>
            </li>
        </ul>
    </div>
    <div class="fix">
        <a href=""><img src="./images/arrow.png" alt=""></a>
    </div>
    <!-- 3、底部模块制作 begin -->
    <footer>
        <!-- 推广模块 -->
        <div class="socialFooter">
            <p class="txt">关注《守望先锋》“归来”</p>
            <!-- 图标列表 -->
            <ul class="list">
                <li>
                    <a href="https://weibo.com/u/5346440662">
                        <i class="iconfont icon-xinlangweibo"></i>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-weixin"></i>
                        <p class="img">
                            <img src="https://blz.nosdn.127.net/1/ow2/home/weixin.jpg" alt="">
                        </p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-bilibili"></i>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-douyin"></i>
                        <p class="img douyin-img">
                            <img src="https://blz.nosdn.127.net/1/ow2/home/douyin.jpg" alt="">
                        </p>
                    </a>
                </li>
                <li>
                    <a href="#" class="xiaohongshu">
                        <p class="img">
                            <img src="https://blz.nosdn.127.net/1/ow2/home/redbook.png" alt="">
                        </p>
                    </a>
                </li>
            </ul>
        </div>
        <!-- 版权模块 -->
        <div class="footer">
            <!-- 商业合作模块 -->
            <div class="footer_business">
                <ul class="clearfix">
                    <li><span class="icon icon1"></span>在线客服</li>
                    <li><span class="icon icon2"></span>反馈</li>
                    <li><span class="icon icon3"></span>加入我们</li>
                </ul>
            </div>
            <!-- 版权信息模块 -->
            <div class="cprt">
                <a href="" class="footer_logo"></a>
                <a href="" class="footer_origin"></a>
                <div class="footer_info">
                    <ul class="clearfix">
                        <li><a href="#">隐私</a>|</li>
                        <li><a href="#">法律</a>|</li>
                        <li><a href="#">条款</a>|</li>
                        <li><a href="#">API</a></li>
                    </ul>
                    <p>
                        ©2022 暴雪娱乐有限公司版权所有
                        <span>由上海网之易网络科技发展有限公司运营</span>
                        <span> | </span>
                        <span>新广出审[2016]378号</span>
                    </p>
                    <p>
                        <span>文网游进字[2016]0025号</span>
                        <span> | </span>
                        <a href="#">增值电信业务经营许可证编号：沪B2－20080012</a>
                        <span> | </span>
                        <a href="#">沪ICP备：沪B2－20080012－15</a>
                    </p>
                    <p>
                        互联网违法和不良信息举报电话：0571-28090163 沪公网安备 31011502052167号
                        <span> | </span>
                        <a href="#">上海市网络游戏行业自律公约</a>
                    </p>
                    <p>
                        <a href="#">
                            <img src="https://blz.nosdn.127.net/1/frame/cprt/zx110.png" alt="">
                        </a>
                        <a href="#">
                            <img src="https://blz.nosdn.127.net/1/frame/cprt/sgs-icon.png" alt="">
                        </a>
                        <a href="#">
                            <img src="https://blz.nosdn.127.net/1/frame/cprt/icon20120516.png" alt="">
                        </a>
                        <span>| 适龄提示：适合13岁及以上使用 </span>
                        <a href="#">家长监护工程</a>
                        <span> | </span>
                        <a href="#">网上有害信息专区</a>
                    </p>
                </div>
            </div>
            <!-- 脚注 -->
            <div class="footer_tips">
                <p>
                    积极健康的游戏心态是健康游戏的开端，本游戏故事情节设置紧凑，请您合理控制游戏时间，避免沉溺游戏影响生活，注意自我保护，防范网络陷阱。
                    <br />
                    健康游戏忠告：抵制不良游戏，拒绝盗版游戏。注意自我保护，谨防受骗上当。适度游戏益脑，沉迷游戏伤身。合理安排时间，享受健康生活。
                </p>
            </div>
        </div>
    </footer>
    <!-- 3、底部模块制作 end -->
    <script src="./js/common.js"></script>
    <script src=""></script>
</body>

</html>